<!-- 采用html5  -->
<!DOCTYPE html>
<html>

<head>

    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <!-- 页面显示适应移动设备 -->
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">

    <title>监测系统</title>
    <link rel="stylesheet" href="resources\we-vue\style.css">
    <link rel="stylesheet" href="resources\css\font-awesome.min.css">
    <style>
        /*元素选择器*/

        html {
            height: 100%;
        }

        body {
            height: 100%;
            padding: 0px;
            /*内边距*/
            margin: 0px;
            /*外边距*/
        }

        
    </style>
</head>

<body>
    <!-- div ：矩形区域 -->
    <div id="app">

        <wv-header title="监测系统" :fixed="false" background-color="#000000">
             <!--
            <div slot="right">
                <wv-switch v-model="SwitchButton" :is-in-cell="false" @click="Switch"></wv-switch>
            </div>    
            -->
        </wv-header>
        
        <center><iframe src="line.html" width=98% height="332" style="margin-top:10px;"></iframe></center>

        <wv-group>
            <wv-input label="起始时间" type="datetime-local" v-model="dep.ds_time1"></wv-input>
            <wv-input label="终止时间" type="datetime-local" v-model="dep.ds_time2"></wv-input>
        </wv-group>

        <center>
            <wv-button type="primary" :mini="true" @click="enter">确认</wv-button>
            <wv-button type="primary" :mini="true" @click="reflush">刷新</wv-button>
            <wv-button type="primary" :mini="true" @click="history">超标</wv-button>
        </center>

        <wv-tabbar>
            <wv-tabbar-item @click="onPerson">
                <i class="fa fa-user"></i>
                <br />修改密码
            </wv-tabbar-item>

            <wv-tabbar-item @click="putOut">
                <i class="fa fa-user"></i>
                <br />注销
            </wv-tabbar-item>
        </wv-tabbar>
    </div>

</body>

<script src="resources\js\vue.min.js"></script>
<script src="resources\js\jquery.min.js"></script>
<script src="resources\we-vue\index.js"></script>
<script src="resources\layer_mobile\layer.js"></script>
<script src="resources\js\my.js"></script>

<script>
    //Vue对象的作用就是渲染界面,需要绑定一个元素

    new Vue({
        el: '#app',
        data: {
            dep: {
                ds_time1: '',
                ds_time2: '',
                flag: '',
            },
            SwitchButton: '',
        },
        methods: {
            onPerson() {
                window.location.href = 'changepwd.html';
            },
            putOut() {
                window.location.href = 'index.html';
            },
            enter() {
                if (this.dep.ds_time1 == '') {
                    TopTips('请输入起始时间');
                    return;
                }
                if (this.dep.ds_time2 == '') {
                    TopTips('请输入结束时间');
                    return;
                }
                this.dep.flag = "search";
                Serv.operate({
                        url: '/search.jsp',
                        data: this.dep,
                    },
                    () => {
                        setTimeout(
                            () => {
                            //通过js向另一个页面跳转
                            window.location.href = 'home.html';
                        },
                        1000);
                    }
                );
            },
            reflush() {
                this.dep.flag = "now";
                Serv.operate({
                        url: '/search.jsp',
                        data: this.dep,
                    },
                    () => {
                        setTimeout(
                            () => {
                            //通过js向另一个页面跳转
                            window.location.href = 'home.html';
                        },
                        1000);
                    }
                );
            },
            history(){
                window.location.href = 'history.html';
            },
        },
    }); 


</script>

</html>